<template>
  <view class="container">
    <view class="left-bottom-sign"></view>
    <!-- <view class="back-btn yticon icon-zuojiantou-up" @click="navBack"></view> -->
    <view class="right-top-sign"></view>
    <!-- 设置白色背景防止软键盘把下部绝对定位元素顶上来盖住输入框等 -->
    <view class="wrapper">
      <view class="left-top-sign">LOGIN</view>
      <view class="welcome"> 登录中，请稍候... </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  onLoad(option) {
    this.loadWxmpInfo(option);
  },
  onShow() {},
  methods: {
    loadWxmpInfo(option) {
      console.log("option", option);
      if (option.token) {
        this.login(option);
        return;
      } else if (option.applyId) {
        // 未获取到token，但获取到applyId，即从待办事项进入且当前微信未绑定账号
        uni.setStorageSync("workInfo", option);
      }
      // 保存跳转信息
      const openKey = option.openKey;
      if (openKey && openKey.length > 0) {
        uni.setStorageSync("openKey", openKey);
        uni.setStorageSync("wxLogin", true);
      }
      this.toIndex(option.msgCode);
    },
    login(option) {
      // 获取到token
      let msgCode;
      this.$store.dispatch("wxIndexLoad", option.token).then((res) => {
        if (res.code === 0) {
          // 登录成功
          msgCode = 0;
          if (option.applyId) {
            // 获取到applyId，从待办事项进入，重定向到相应页面
            this.toBacklog(option);
            return;
          }
        } else {
          msgCode = res.message;
        }

        this.toIndex(msgCode);
      });
    },
    toBacklog(option) {
      // 缓存参数，重定向至主页后再重定向至待办消息
      uni.setStorageSync("backlogOption", option);
      this.toIndex();
    },
    toIndex(msgCode) {
      const suffix = msgCode ? '?msgCode=' + msgCode : '';
      uni.reLaunch({ url: `/pages/index/index${suffix}` });
    },
  },
};
</script>

<style lang="scss">
page {
  background: #fff;
}

.container {
  padding-top: 115px;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #fff;
}

.wrapper {
  position: relative;
  z-index: 90;
  background: #fff;
  padding-bottom: 40upx;
}

.left-top-sign {
  font-size: 120upx;
  color: $page-color-base;
  position: relative;
  left: -16upx;
}

.right-top-sign {
  position: absolute;
  top: 80upx;
  right: -30upx;
  z-index: 95;

  &:before,
  &:after {
    display: block;
    content: "";
    width: 400upx;
    height: 80upx;
    background: #b4f3e2;
  }

  &:before {
    transform: rotate(50deg);
    border-radius: 0 50px 0 0;
  }

  &:after {
    position: absolute;
    right: -198upx;
    top: 0;
    transform: rotate(-50deg);
    border-radius: 50px 0 0 0;
    /* background: pink; */
  }
}

.left-bottom-sign {
  position: absolute;
  left: -270upx;
  bottom: -320upx;
  border: 100upx solid #d0d1fd;
  border-radius: 50%;
  padding: 180upx;
}

.welcome {
  position: relative;
  text-align: center;
  // left: 50upx;
  // top: -90upx;
  font-size: 46upx;
  color: #555;
  text-shadow: 1px 0px 1px rgba(0, 0, 0, 0.3);
}
</style>
